﻿
@charset "utf-8";

body {
	position: relative;
	margin: 0;
	padding: 0;font: 400 13px/normal '微软雅黑';
}
.online_func {
	position: fixed;
	right: 0px;
	top: 50%;
	width: 72px;
	transform: translateY(-50%);
	z-index: 50;
}
@media (max-width: 900px) {
.online_func {
	position: fixed;
	top: auto;
	right: 0;
	bottom: 0;
	left: 0;
	width: auto;
	transform: none;
}
}



.online_func .online_list {
}
.online_func .online_list .online_item {
	display: block;
	position: relative;
	height: 92px;
	padding: 1px 0;
	color: #fff;
	background: #f3f3f3;
	margin: 1px 0;
	text-align: center;
	transition: all ease .4s
}

.online_func .online_list .online_item.online_qq {
	display: block;
	background: #6DA9DE;
}
.online_func .online_list .online_item.online_qq:hover {
	display: block;
	background: #488BC7;
}

.online_func .online_list .online_item.online_wechat {
	display: block;
	background: #78C340;
}
.online_func .online_list .online_item.online_wechat:hover {
	display: block;
	background: #58A81C;
}
.online_func .online_list .online_item.online_phone {
	display: block;
	background: #FBB01F;
}
.online_func .online_list .online_item.online_phone:hover {
	display: block;
	background: #FF811B;
}

.online_func .online_list .online_item.online_back {
	display: block;
	background: #666666;
}
.online_func .online_list .online_item.online_back:hover {
	display: block;
	background: #444444;
}


@media (max-width: 900px) {
.online_func .online_list .online_item.online_wechat {
	display: block;
}
}
@media (max-width: 900px) {
.online_func .online_list .online_item.online_phone {
	display: block;
}
}
@media (max-width: 900px) {
.online_func .online_list .online_item {
	float: left;
	width: 25%;
	margin: 0;
	height: 78px;
}
}
.online_func .online_list .online_item:hover {
	color: white;
	background: #355571;
}
.online_func .online_list .online_item .online_symbol {
	display: block;
	margin: 10px 0 10px;
}
@media (max-width: 900px) {
.online_func .online_list .online_item .online_symbol {
	height: 48px;
	margin: 7px 0 0;
}
}
.online_func .online_list .online_item .online_symbol .ico.ico_tencent {
	display: inline-block;
	width: 41px;
	height: 45px;
	background: url(qq.png);
}
.online_func .online_list .online_item .online_symbol .ico.ico_barcode {
	display: inline-block;
	width: 40px;
	height: 40px;
	background: url(code.png);
}
.online_func .online_list .online_item .online_symbol .ico.ico_phone {
	display: inline-block;
	width: 40px;
	height: 40px;
	background: url(tel.png);
}
.online_func .online_list .online_item .online_symbol .ico.ico_backtop {
	display: inline-block;
	width: 25px;
	height: 41px;
	background: url(back.png);
}
.online_func .online_list .online_item .online_wnd {
	display: none;
	position: absolute;
	top: 50%;
	right: 100%;
	width: 180px;
	height: 180px;
	margin: -6px 7px -6px -6px;
	padding: 6px 15px 6px 6px;
	transform: translateY(-50%);
	background: url(wxbg-.png);
}

.online_func .online_list .online_item .online_tel {
	display: none;
	position: absolute;
	top: 0%;
	right: 100%;
	width: 160px;line-height: 30px;
	height: 92px;background: #FF811B;font-size:18px;

}
@media (max-width: 900px) {
.online_func .online_list .online_item .online_wnd {
	top: auto;
	bottom: 100%;
	right: 50%;
	margin: 0 0 10px 0;
	padding: 0;
	transform: translate(50%, 0);
	background: white;
	box-shadow: 0 0 7px rgba(115,115,115,.72);
}

}
.online_func .online_list .online_item .online_wnd .online_wnd_content {
	text-align: center;
	line-height: 160px;
}
.online_func .online_list .online_item .online_wnd .online_wnd_content .barcode_img {
	vertical-align: middle;
}
.online_func .online_list .online_item:hover .online_wnd {
	display: block;
}

.online_func .online_list .online_item .online_tel .online_tel_content {
	text-align: center;
	line-height: 73px;
}
.online_func .online_list .online_item .online_tel .online_tel_content .barcode_img {
	vertical-align: middle;
}

.online_func .online_list .online_item:hover .online_tel {
	display: block;
}

@media (max-width: 900px) {
.online_func .online_list .online_item:hover .online_tel {
	display: none;
}
}



.online_func .online_list .online_item:hover .online_symbol .ico.ico_barcode {
	background: url(code.png);
}
.online_func .online_list .online_item:hover .online_symbol .ico.ico_phone {
	background: url(tel.png);
}
.online_func .online_list .online_item:hover .online_symbol .ico.ico_backtop {
	background: url(back.png);
}
.online_page_holder {
	display: none;
}

@media(max-width:500px) {
.online_page_holder {
	display: block;
}
}

